<template>
<div class="box-weight">
    <div class="title">预估重量 <span>(Kg)</span> </div>
    <input class="ipt" type="number" placeholder="请输入预估重量" @input='this.weightChange'>
</div>
</template>

<script>
export default {
    components: {},
    props: ['weight'],
    model: {
        prop: "weight",
        event: "changeWeight"
    },
    methods: {
        weightChange(e) {
            this.$emit('changeWeight', e.target.value);
            this.$emit('weightChange')
        }
    }
}
</script>

<style lang="less" scoped>
.box-weight {
    width: 100%;
    background-color: #fff;
    padding: 0 14px 15px;

    .title {
        width: 100%;
        padding: 19px 0 0;
        font-size: 16px;
        font-family: PingFang SC;
        font-weight: 400;
        color: #333333;

        span {
            font-size: 12px;
            color: #999999;
        }
    }

    .ipt {
        width: 100%;
        height: 33px;
        font-size: 14px;
        font-family: PingFang SC;
        font-weight: 400;
        color: #333;
        border-bottom: 1px solid #EEEEEE;
    }

    .ipt::placeholder {
        font-size: 14px;
        font-family: PingFang SC;
        font-weight: 500;
        color: #CCCCCC;
    }
}
</style>
